<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<@cms_site id=siteId!'' >
		<@cms_channel id=businessId!'' >
			<meta name="keywords" content="${(site.keywords)!''},${(tag_bean.name)!''}" />
			<title>${(tag_bean.name)!''}</title>
		</@cms_channel>
		</@cms_site>
	    <link rel="stylesheet" href="${ctx}/css/wechat/phone.css" />
	    <link rel="stylesheet" href="${ctx}/css/wechat/style.css" />
	    <link rel="stylesheet" href="${ctx}/css/wechat/swiper.3.1.7.min.css" />
	    <script type="text/javascript" src="${ctx}/js/wechat/jQuery.1.8.2.min.js" ></script>
	    <script type="text/javascript" src="${ctx}/js/wechat/height.js" ></script>
	    <script type="text/javascript" src="${ctx}/js/wechat/swiper.3.1.7.min.js" ></script>
	    <style>
	    	body{
	    		background: url(${ctx}/img/wechat/crjyw_index_bgimg.jpg);
	    		background-size: 100% 100%;
	    		background-repeat: no-repeat;
	    		background-position: center;
	    	}
	    	.boxShadow{-moz-box-shadow:0px 0px 10px #ABABAB; -webkit-box-shadow:0px 0px 10px #ABABAB; box-shadow:0px 0px 10px #ABABAB;}
	    	
	    	.swiper-pagination,.swiper-pagination-clickable{
				top: 5%;left:60%;
			}
			.swiper-pagination-bullet {
				width: 40px;height: 3px;margin-left: 20px;
				display: inline-block;border-radius: 0;
				background: #e0dada;opacity: .8;
			}
			.swiper-pagination-bullet-active {opacity: 1;background: #ed425b;}.swiper-pagination{padding-right: 8px;}
	    </style>
	</head>
	<body>
		<div class="container-fluid">
			<div class="row">
				<div class="col12">
					<div class="swiper-container" style="margin-top: 20%;">
					    <div class="swiper-wrapper">
					        <div class="swiper-slide">
					        	<ul class="display-ib">
					        		<li class="tc mb44">
					        			<a href="${ctx}/f/mp/s_10007/h_10085">
					        				<img src="${ctx}/img/wechat/yybz.png" class="w-56 ht56 radius-circle" />
					        				<p class="font16 font-38516b mt6">预约办证</p>
					        			</a>
					        		</li>
					        		<li class="tc mb44">
					        			<a href="${ctx}/f/mp/s_10007/h_10086">
						        			<img src="${ctx}/img/wechat/zxbl.png" class="w-56 ht56 radius-circle" />
						        			<p class="font16 font-38516b mt6">在线办理</p>
					        			</a>
					        		</li>
					        		<li class="tc mb44">
					        			<a href="${ctx}/f/mp/s_10007/h_10087">
						        			<img src="${ctx}/img/wechat/cxjd.png" class="w-56 ht56 radius-circle" />
						        			<p class="font16 font-38516b mt6">查询进度</p>
					        			</a>
					        		</li>
					        	</ul>
					        </div>
					        <div class="swiper-slide">
					        	<ul class="display-ib" style="margin-top: 20%;">
					        		<li class="tc mb44">
					        			<a href="${ctx}/f/mp/s_10007/h_10034">
						        			<img src="${ctx}/img/wechat/yybz.png" class="w-56 ht56 radius-circle" />
						        			<p class="font16 font-38516b mt6">收费标准</p>
					        			</a>
					        		</li>
					        		<li class="tc mb44">
					        			<a href="${ctx}/f/mp/s_10007/h_10035">
						        			<img src="${ctx}/img/wechat/zxbl.png" class="w-56 ht56 radius-circle" />
						        			<p class="font16 font-38516b mt6">办事指引</p>
					        			</a>
					        		</li>
					        	</ul>
					        </div>
					    </div>
					</div>
					<!-- 如果需要对应的锚点 -->
					<div class="swiper-pagination"></div>
				</div>
			</div>
		</div>
	</body>
	
	<script>
		var mySwiper = new Swiper ('.swiper-container', {
			pagination: '.swiper-pagination',
        	paginationClickable: true,
		    /*autoplay : 10000000,*/
		});
	</script>
	
</html>
